
/* position and dimensions of the navigator */
.navi {
  	 cursor: pointer;
    float: left;
    height: 20px;
    left: 45%;
    position: absolute;
    top: 10px;
    z-index: 10;
}


/* items inside navigator */
.navi a {
    width:12px;
    height:12px;
    float:left;
    margin:3px;
    background:url(../img/navigator.png) 0 0 no-repeat;
    display:block;
    font-size:1px;
}

/* mouseover state */
.navi a:hover {
    background-position:0 -12px;
}

/* active state (current page state) */
.navi a.active {
    background-position:0 -24px;
}

 /* main vertical scroll */
  #main {
  position:relative;
  overflow:hidden;
  height: 552px;
  }

  /* root element for pages */
  #pages {
  position:absolute;
  height:20000em;
  }

  /* single page */
  .page {
  position:relative;
  z-index:1;
  height: 552px;
  background:#222 url(../img/h600.png) 0 0 repeat-x;
  width:720px;
  }

  /* root element for horizontal scrollables */
  .scrollable {
  position:relative;
  overflow:hidden;
  width: 720px;
  height: 552px;
  }

  /* root element for scrollable items */
  .scrollable .items {
  width:20000em;
  position:absolute;
  clear:both;
  }

  /* single scrollable item */
  .item {
  float:left;
  cursor:pointer;
  width:720px;
  height:552px;
  position: relative;
  
  }

  /* main navigator */
  #main_navi {
  	position:relative;
  	z-index:10;
  float:left;
  padding:0px !important;
  margin:0px !important;
  }

  #main_navi li {
     background: url("../img/menu-bg.png") no-repeat scroll 0 0 transparent;
    
    clear: both;
    color: #666666;
    cursor: pointer;
    font-size: 12px;
    height: 62px;
    list-style-type: none;
    padding: 12px 10px 5px;
    width: 200px;
}


  #main_navi li:hover {
  	color:white;
 	background-position: 0 -92px ;
  }

  #main_navi li.active {
  color:white;
  background-position: 0 -92px ;
  position: relative;
 
  }

  #main_navi li.active .orange-arrow {
  	background:transparent url(../img/orange-arrow.png) no-repeat 0 0;
  	position: absolute;
  	height: 20px;
  	width: 10px;
  	right: -10px;
  	top: 40%;
  }
  #main_navi img {
  float:left;
  margin-right:10px;
  }

  #main_navi strong {
  display:block;
  }


  
#main_navi h2 { font: normal 21px 'MyriadProLightRegular'; margin-top:15px; }
#main h3 { color: white;}

#main .item .map { bottom: 0; right: 0;}
#main .item .map .proy-description ul li { color: white; background:transparent url(../img/cube-bullet.png) no-repeat 0 5px ; padding-left: 12px;}
.item .none { display: none;}
.item a.btn { color: white;  }

.proy-description .icons li {
      background: none repeat scroll 0 0 transparent !important;
    float: left;
    height: 41px;
    margin-right: 5px;
    margin-top: 10px;
    padding-left: 0 !important;
    width: 41px;
}
.proy-description .icons li a {
    background: url("../img/icons.png") no-repeat scroll 0 0 transparent;
    display: block;
    height: 41px;
    width: 41px;
}
.proy-description .icons li.cards a {
    background-position: 0 0;
}
.proy-description .icons  li.fire a {
    background-position: -52px 0;
}
.proy-description .icons  li.wind a {
    background-position: -104px 0;
}
.proy-description .icons  li.camera a {
    background-position: -156px 0;
}

